<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>住客列表</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/views/static/common/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/views/static/admin/css/style.css">
    <script src="${pageContext.request.contextPath}/views/static/common/layui/layui.js"></script>
    <script src="${pageContext.request.contextPath}/views/static/common/jquery-3.3.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/views/static/common/vue.min.js"></script>
<style>
    .pageIndex {
        width: 600px;
        text-align: center;
        margin: 30px auto;
    }

    .pageIndex a {
        width: 30px;
        height: 30px;
        display: inline-block;
        text-align: center;
        line-height: 30px;
        background-color: rgba(47,47,47,0.3) !important;
        color: #E5DFD5;
        text-decoration: none;
    }

    .active {

        background-color: rgba(111,140,245,0.5);
    }
    body{
        color: #E5DFD5;!important;
    }
    table{

        width: 100%;
        margin-top: 30px
    }
    thead{
        height: 40px;
    }
    thead tr{
        background-color: rgba(47,47,47,0.4) !important;

    }
    tbody{
        background-color: rgba(47,47,47,0.1); !important;
        text-align: center;
    }
    td,th{
        border: solid 1px rgba(255,255,255,0.2) !important;
    }

    input[type="text"]{
        margin-left: 80px;
        width: 900px;
        margin-right: 10px;
    }
    button[type="submit"]{
        background-color: rgba(47,47,47,0.4);
        color: #E5DFD5;
        border: 0px;
        height: 40px;
        width: 60px;
    }
    td a{
        color: blueviolet;
    }
    tr{
        height:40px;
    }
</style>
</head>
<body>
<%----%>
<div id="app">
    <%----%>

        <!--右侧-->
        <div style="margin-left: 0; margin-top: 0 "  class="right">
            <div class="layui-row">
                <fieldset class="layui-elem-field layui-field-title">
                    <legend>住客列表</legend>
                </fieldset>
                <%--                搜索--%>
                                <form method="post"   action="${pageContext.request.contextPath}/orderFind" >
                                <div  style="float: left">
                                    <div>
                                        <span style="color: red; font-weight: bold" > &nbsp;${error}</span>
                                    </div>
                                    <div  style=" width:1000px;float: left" >
                                        <input type="text" name="username" placeholder="输入客户名称进行查询" class="layui-input key" >
                                    </div>
                                    <div style="float: right">
                                        <button type="submit"  style="width: 100px">查询</button>
                                    </div>
                                </div>
                                </form>

            </div>

            <%--            表格 --%>
            <table style="" >

                <thead>
                <tr>
                    <th>编号</th>
                    <th>姓名</th>
                    <th>身份证号</th>
                    <th>手机号</th>
                    <th>入住时间</th>
                    <th>退房时间</th>
                    <th>是否为会员</th>
                    <th>房间号</th>
                    <th>房间类型</th>
                    <th>实付价格</th>
                    <th>房间状态</th>
                </tr>
                </thead>

                <tbody>
                <c:forEach items="${page.list}" var="userMessage" varStatus="status">
                    <tr class="id36567">
                        <td>${status.index+1}</td>
                        <td>${userMessage.username}</td>
                        <td>${userMessage.userIdNumber}</td>
                        <td>${userMessage.userPhoneNumber}</td>
                        <td>${userMessage.userStartTime}</td>
                        <td><c:if test="${userMessage.userEndTime=='1900-01-01 00:00'}">
                            <div>暂未退房</div>
                        </c:if>
                            <c:if test="${userMessage.userEndTime!='1900-01-01 00:00'}">
                                <div>${userMessage.userEndTime}</div>
                            </c:if></td>
<%--                        <td>${userMessage.userEndTime}</td>--%>
                        <td>${userMessage.isVip==1}</td>
                        <td>${userMessage.roomNumber}</td>
                        <td>${userMessage.roomCategoryName}</td>
                        <td>${userMessage.truePrice}</td>
                        <td>
                            <c:if test="${userMessage.userState==1}">
                                <div style="color: red">已入住</div>
                            </c:if>
                            <c:if test="${userMessage.userState==0}">
                                <div style="color: green">已退房</div>
                            </c:if>
                        </td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
        <div class="pageIndex">
            <c:forEach items="${page.pageIndex}" var="item">
                <c:if test="${item ne '...'}">
                    <c:if test="${(page.currentIndex eq item) && !(empty item) }">
                        <a class="active" href="${pageContext.request.contextPath}orderList?index=${item}">${item}</a>
                    </c:if>
                    <c:if test="${page.currentIndex ne item && !(empty item)}">
                        <a href="${pageContext.request.contextPath}/orderList?index=${item}">${item}</a>
                    </c:if>
                </c:if>
                <c:if test="${item eq '...'}">
                    <a href="">${item}</a>
                </c:if>
            </c:forEach>
        </div>
        <div style="width: 600px;text-align: center;margin: 0 auto; color: #E5DFD5">当前第${page.currentIndex}页，共${page.totalPage}页</div>
    </div>
</div>
<script src="${pageContext.request.contextPath}/views/static/admin/js/config.js"></script>
<script src="${pageContext.request.contextPath}/views/static/admin/js/script.js"></script>
</body>
</html>

